<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hello Vue</title>
  </head>

  <body>
    <div id="root">
      <h1>姓名:{{message.name}}</h1>
      <h1>地址:{{message.address}}</h1>
      <h2>学科:{{message.subjects}}</h2>
    </div>
  </body>
  <script src="../js/vue.js"></script>
  <script>
    vue.config.productionTip = false
    //1.创建一个Vue的实例对象
    const vue = new Vue({
      //2.传入配置信息
      el: "#root", //挂载的元素
      data: { //data是存储数据的地方
        message: {
          name: "hello,尚硅谷！",
          address: '天安云谷',
          subjects: ['前端', 'Java', 'PHP', 'JS']
        }
      }
    })
  </script>

</html>